<template>
  <div class="add-address">
    <van-nav-bar
      title="添加地址"
      left-arrow
      :fixed=true
      :border=true
      @click-left="handleToBack">
    </van-nav-bar>
    <van-address-edit
      :area-list="areaList"
      show-postal
      show-set-default
      show-search-result
      :search-result="searchResult"
      save-button-text="保存"
      @save="onSave"
      style="margin-top: 52px" />
  </div>
</template>

<script>

import { mapMutations } from 'vuex'
import areaList from '@/config/area.js'
export default {
  name: 'AddAddress',
  data () {
    return {
      areaList: areaList,
      searchResult: []
    }
  },
  methods: {
    handleToBack () {
      this.$router.go(-1)
    },
    // 2. 保存
    onSave (content) {
      let addressID = this.addressID().toString()
      content['id'] = addressID
      content['address'] = `${content.province}${content.city}${content.county}${content.addressDetail}`
      this.ADD_USER_SHOPPING_ADDRESS({
        content
      })
      this.$router.back()
    },
    // 生成不重复的id
    addressID () {
      let lastUuid = 0
      return (new Date()).getTime() * 1000 + (lastUuid++) % 1000
    },
    ...mapMutations(['ADD_USER_SHOPPING_ADDRESS'])
  }
}
</script>
<style lang="scss" scoped>
.add-address {
  @include setAllcover(9999);
  background-color: $bg-color-page;
  .van-address-edit {
    .van-button {
      background-color: $theme-clor-green;
    }
  }
}
</style>
